<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>搜索框</title>
    <style>
        .wrapper{
            border: 1px solid black; overflow:hidden
        }
        .left{
            float: left;
            background-color: #FFFFFF;
            width: 80%;
        }
        .right{
            float: right;
            width: 20%;
            background-color: #FFFFFF;
            margin: auto;
        }
        .first{
            height: 40px;
        }
        .box{
            float:left;
            width: 100%;
            height: 38px;
            border: none;
            outline: none;
            font-size: 24px ;
            background-color: #FFFFFF;
        }
        .btn1{
            float: right;
            width: 100%;
            height: 40px;
            border: none;
            outline: none;
            font-family: 楷体;
            color: #FFFFFF;
            font-size: 24px;
            background-color: #38f;
        }
        .btn2{
            float:right;
            width: 100%;
            height: 40px;
            border: none;
            outline: none;
            font-family: 宋体;
            color: #FFFFFF;
            font-size: 24px;
            background-color: #19b955;
        }
        .btn3 {
            width: 100%;
            height: 40px;
            border: none;
            outline: none;
            background: #db0000 url("CR.png")  140px 10px  no-repeat;
            font-size: 0;
            text-indent: -9999px;
        }
    </style>
</head>
<div>
    <div class="wrapper">
        <form action="http://www.baidu.com/s" autocomplete="off" >
            <div class="left">
                <input type="text" name="wd" class="box">
            </div>
             <div class="right">
                    <input type="submit" value="百度一下" class="btn1">
             </div>
        </form>
    </div>

    <div class="first"></div>

    <div class="wrapper">
        <form action="http://www.so.com/s" autocomplete="off" >
            <div class="left">
                <input type="text" name="q" class="box">
            </div>
            <div class="right">
                <input type="submit" value="搜索" class="btn2">
            </div>
        </form>
    </div>

    <div class="first"></div>

    <div class="wrapper">
        <form action="http://chinaso.com/search/" autocomplete="off" target="_blank" >
            <div class="left">
                <input type="text" name="q" class="box">
            </div>
            <div class="right">
                <input type="submit" value="中国搜索" class="btn3">
            </div>
        </form>
    </div>

</div>



</body>

</html>